<template>
  <div>
    <div style="padding:10px;">
      <el-alert :closable="false" title="商品管理"/>
    </div>
    <div style="padding:10px;">
      <el-alert :closable="false" title="商品权重：权重最低为0 ，最高为10，商品的权重越高，被看到的可能性越大"/>
    </div>

    <template>
      <el-table
        :data="goodsData"
        style="width: 100%">
        <el-table-column
          prop="id"
          label="商品id"
          width="50">
        </el-table-column>
        <el-table-column
          prop="sellerName"
          label="卖家"
          width="100">
        </el-table-column>
        <el-table-column
          prop="description"
          label="商品描述"
          width="200">
        </el-table-column>
        <el-table-column
          prop="price"
          label="价格"
          width="100">
        </el-table-column>
        <el-table-column
          prop="stockNum"
          label="库存"
          width="100">
        </el-table-column>

        <el-table-column
          prop="soldNum"
          label="销量"
          width="80">
        </el-table-column>
        <!--<el-input-number v
                          -model="num"
                          @change="handleChange"
                          :min="1"
                          :max="10"
                          label="权重">

         </el-input-number>-->
        <el-table-column
          prop="weight"
          label="权重"
          width="220">
          <template slot-scope="scope">
            <el-input-number

              v-model="scope.row.weight"
              @change="handleChange(scope.row)"
              :min="0"
              :max="10"
              label="权重">

            </el-input-number>
          </template>
        </el-table-column>

        <el-table-column
          fixed="right"
          label="操作"
          width="100">
          <template slot-scope="scope">
            <el-button
              v-on:click="open(scope.row)"
              type="text"
              size="small"
            >删除商品
            </el-button>
            <!-- <el-button type="text" size="small">编辑</el-button>-->
          </template>
        </el-table-column>
      </el-table>
    </template>

  </div>

</template>

<script>
  import {ApiService} from "@/api/apiService";

  export default {
    data() {
      return {
        goodsData: [],
        num: 1
      }

    },
    mounted() {
      this.getGooodsMessage()
    },
    methods: {
      handleChange(row) {
        console.log(row);
        const updateGoodsWeight = new ApiService("/updateGoodsWeight")
        updateGoodsWeight.getParams({
          goodsId:row.id,
          goodsWeight:row.weight
        })

      },
      open(row) {
        this.$confirm('此操作将永久删除该商品, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          this.$message({
            type: 'success',
            message: '删除成功!'
          });
          this.deleteGoods(row)
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消删除'
          });
        });
      },
      deleteGoods(row) {
        console.log("row" + row.id)//获取到商品id
        const deletePost = new ApiService("/admin/deleteGoods")
        deletePost.getParams({
            goodsId: row.id
          }
        )
        location.reload();
      },
      getGooodsMessage() {

        const getGoodsMessage = new ApiService("/pethome/goods")
        getGoodsMessage.getParams(
          {
            value1: 0,
            value2: "a"
          }
        ).then(res => {
            console.log("res.data" + res.data)
            this.goodsData = res.data;
          }
        )
      }
    }
  }


</script>

<style scoped>

</style>

